import React,{useState,useEffect, useContext} from 'react'
import { $pre } from '../../http/http'
import Header from "../../components/Header/Header"
import {reqcartadd, reqgoodsinfo} from "../../http/api"
import "./Detail.less"
import { Button } from 'antd-mobile'
import {MyContext} from "../../App"
export default function Detail(props) {
  //初始化
 const [info,setInfo] = useState({})
 const {state:{userInfo:{uid}}} = useContext(MyContext)
 useEffect(()=>{
  //请求数据
  reqgoodsinfo({id:props.match.params.id}).then(res=>{
    setInfo(res.data.list[0])
  })
 },[])
 //加入购物车
 const addShop=()=>{
   reqcartadd({
     uid,
     goodsid:props.match.params.id,
     num:1,
     type:1
   })
   props.history.push("/index/shop")
 }
  return (
    <div>
    <Header back title="商品详情"></Header>
    <div className='card'>
      <img src={$pre+ info.img} alt="" />
      <div>
        <h3>商品名称：{info.goodsname}</h3>
        <div>价格：{info.price}</div>
        <div>市场价格：{info.market_price}</div>
      </div>
    </div>
    <Button color='primary' onClick={()=>addShop()}>加入购物车</Button>
  </div>
  )
}

